import BraftEditor from 'braft-editor'
import 'braft-editor/dist/index.css'
import { useState } from 'react'
import { Form, Input } from 'antd';

const Com = () => {
  const [ editorState, setEditorState ] = useState(BraftEditor.createEditorState(''))
  const handleChange = (editorState) => {
    setEditorState(editorState)
  }
  
  const start = `请在这里输入正文`
  
  return (
    <div style = {{ width: '100%', height: '100%', overflow: 'auto',zIndex: 99}}>
       <Form>
        <Form.Item
          label="标题"
          name="标题"
          rules={[{ required: true, message: '请在这里输入标题!' }]}
        >
           <Input placeholder='请输入标题'/>
        </Form.Item>
        <Form.Item
          label="作者"
          name="作者"
          rules={[{ required: true, message: '请在这里输入作者!' }]}
        >
           <Input placeholder='请输入作者'/>
        </Form.Item>

          <BraftEditor style={{zIndex: 10}}
            value = { editorState }
            onChange = { handleChange }
            placeholder = { start }
          />
     
      </Form>
    </div>
  )
}

export default Com